<!doctype html>
<html lang="en-US">
  <head>
    <style>
      *,
      ::before,
      ::after {
        box-sizing: border-box;
      }

      .grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 0.5em;
      }

      .grid > * {
        background-color: darkgray;
        color: white;
        padding: 2em;
        border-radius: 0.5em;
      }
    </style>
  </head>
  <body>
    <div class="grid">
      <div class="a">a</div>
      <div class="b">b</div>
      <div class="c">c</div>
      <div class="d">d</div>
      <div class="e">e</div>
      <div class="f">f</div>
    </div>
  </body>
</html>
